﻿@using System.Globalization
@using SevenSpikes.Nop.Plugins.JCarousel.Domain
@model SevenSpikes.Nop.Plugins.JCarousel.Models.JCarouselModel
@if (Model.Items.Count > 0)
{
    var skin = Model.Settings.Skin;

    Html.AddCssFileParts(Url.Content("~/Plugins/SevenSpikes.Nop.Plugins.JCarousel/Themes/" + Model.Theme + "/Skins/" + skin + "/skin.css"));
    Html.AddScriptParts(Url.Content("~/Plugins/SevenSpikes.Nop.Plugins.JCarousel/Scripts/jquery.jcarousel.min.js"));
    Html.AddScriptParts(Url.Content("~/Plugins/SevenSpikes.Nop.Plugins.JCarousel/Scripts/jquery.disable.text.select.js"));

    var carouselHtmlElementId = Model.Settings.CarouselHtmlElementId;

    string animationSpeed;
    string easing;
    string wrap;

    if (Model.Settings.AnimationSpeed == "none")
    {
        animationSpeed = "0";
    }
    else
    {
        animationSpeed = "'" + @Model.Settings.AnimationSpeed + "'";
    }

    if (Model.Settings.Easing == "none")
    {
        easing = null;
    }
    else
    {
        easing = ", easing: '" + @Model.Settings.Easing + "'";
    }

    if (Model.Settings.WrapItems == "none")
    {
        wrap = null;
    }
    else
    {
        wrap = ", wrap: '" + @Model.Settings.WrapItems + "'";
    }
    
    <script type="text/javascript">

        jQuery(document).ready(function () {
            jQuery('#@carouselHtmlElementId').jcarousel({
                    vertical: @Model.Settings.CarouselOrientation.ToString(CultureInfo.InvariantCulture).ToLower(),
                rtl: @Model.Settings.RightToLeft.ToString(CultureInfo.InvariantCulture).ToLower(),
                start: @Model.Settings.StartIndex,
                scroll: @Model.Settings.ScrollItems,
                animation: @Html.Raw(animationSpeed),
                auto: @Model.Settings.Autoscroll,
                size: @Model.Items.Count
                @if (!String.IsNullOrEmpty(easing))
                {
                    @Html.Raw(easing)
                }
                @if (!String.IsNullOrEmpty(wrap))
                {
                    @Html.Raw(wrap)
                }
            });
            
             $(".jcarousel-prev, .jcarousel-next").disableTextSelect();
        });
        
  
   
    </script>

    <div class="carousel_holder @skin">
        @if (!String.IsNullOrEmpty(Model.Settings.Title) && Model.Settings.ShowTitle)
        {
            if (Model.Settings.CarouselOrientation)
            {
            <h2 class="vertical">@Model.Settings.Title</h2>
            }
            else
            {
            <h2>@Model.Settings.Title</h2>
            }
        }
        <ul id="@carouselHtmlElementId" class="jcarousel-skin-@skin">
            @foreach (var item in Model.Items)
            {           
                <li>
                    @if (Model.Settings.DataSourceType == JCarouselDataSourceTypes.Manufacturers)
                    {
                        <a class="thumb-img" href="@Url.RouteUrl("Manufacturer", new { manufacturerId = item.Id, item.SeName })" title="@item.PictureModel.Title">
                            <img alt="@item.PictureModel.AlternateText" src="@item.PictureModel.ImageUrl" title="@item.PictureModel.Title" /></a>
                    }
                    else if (Model.Settings.DataSourceType == JCarouselDataSourceTypes.SiblingCategories)
                    {
                        <a class="thumb-img" href="@Url.RouteUrl("Category", new { categoryId = item.Id, item.SeName })" title="@item.PictureModel.Title">
                            <img alt="@item.PictureModel.AlternateText" src="@item.PictureModel.ImageUrl" title="@item.PictureModel.Title" /></a>
                    }
                    else
                    {
                        <a class="thumb-img" href="@Url.RouteUrl("Product", new { productId = item.Id, item.SeName })" title="@item.PictureModel.Title">
                            <img alt="@item.PictureModel.AlternateText" src="@item.PictureModel.ImageUrl" title="@item.PictureModel.Title" /></a>
                    }
                    <div class="right_side">
                        @if (Model.Settings.ShowItemsName)
                        {
                            if (Model.Settings.DataSourceType == JCarouselDataSourceTypes.Manufacturers)
                            {
                            <a class="jcarousel-product-name" href="@Url.RouteUrl("Manufacturer", new { manufacturerId = item.Id, item.SeName })" title="@item.PictureModel.Title">
                                @item.Name </a>
                            }
                            else if (Model.Settings.DataSourceType == JCarouselDataSourceTypes.SiblingCategories)
                            {
                            <a class="jcarousel-product-name" href="@Url.RouteUrl("Category", new { categoryId = item.Id, item.SeName })" title="@item.PictureModel.Title">
                                @item.Name </a>
                            }
                            else
                            {
                            <a class="jcarousel-product-name" href="@Url.RouteUrl("Product", new { productId = item.Id, item.SeName })" title="@item.PictureModel.Title">
                                @item.Name </a>
                            }

                        }
                        @if (Model.Settings.ShowShortDescription && Model.Settings.DataSourceType != JCarouselDataSourceTypes.Manufacturers && Model.Settings.DataSourceType != JCarouselDataSourceTypes.SiblingCategories)
                        {
                            <p class="short_descript">@item.ShortDescription</p>
                        }
                        @if (Model.Settings.ShowProdictsPrice && Model.Settings.DataSourceType != JCarouselDataSourceTypes.Manufacturers && Model.Settings.DataSourceType != JCarouselDataSourceTypes.SiblingCategories)
                        {
                            <div class="price_line">
                                @if (Model.Settings.ShowProdictsOldPrice)
                                { 
                                    <span class="jcarousel-old-price">@item.ProductPriceModel.OldPrice</span>
                                }
                                <strong class="jcarousel-price">@item.ProductPriceModel.Price</strong>
                            </div>
                        }
                        <!--price_line-->
                        @if (Model.Settings.ShowDetailsButton && Model.Settings.DataSourceType != JCarouselDataSourceTypes.Manufacturers && Model.Settings.DataSourceType != JCarouselDataSourceTypes.SiblingCategories)
                        {
                            <a class="button" href="@Url.RouteUrl("Product", new { productId = item.Id, item.SeName })">@T("SevenSpikes.JCarousel.Admin.DetailsButton")</a>
                        }
                    </div>
                    <!--right_side-->
                </li>
            }
        </ul>
    </div>
}